<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Jenkins monitor</title>
    <link rel=stylesheet type=text/css href="../html/common.css" />
</head>
<style>
    .update-list li{
        list-style: decimal;
    }
    .button {
        background-color: #555555;; /* Green */
        border: none;
        color: white;
        padding: 15px 32px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        
    }
    .button:hover{
        background-color: #464545;
    }
</style>
<body>
    <div style="text-align: center;">
        <h1>Version update prompt</h1>
        <p>
            <h3>
                The latest version is <span id="version" style="color: blue">loading...</span>, click <a id="url"
                    href="#">here</a> install
            </h3>
        </p>
        <p id="changelog" class="update-list">
            changelog...
        </p>
        <div style="margin-top: 50px;">
                <button class="button" id="update">update</button> <button class="button" id="ignore">ignore</button>
        </div>
    </div>
</body>
<script>
// include some
const {shell, ipcRenderer} = require('electron');
const $ = require("jquery");

/////////////////////////////////////////////////////////

function updateSoftware(url){
    shell.openExternal(url);
}
function ignoreUpdate(){
    ipcRenderer.send("ignoreUpdate","");
}

ipcRenderer.on("assign", function(event, message){
    var data = JSON.parse(message);
    $("#version").html(data.version);
    $("#url").click(function (e) {
        updateSoftware(data.downloadurl);
    });
    $("#update").click(function(e){
        updateSoftware(data.downloadurl);
    });
    $("#ignore").click(function(e){
        ignoreUpdate();
    });
    $("#changelog").html(data.changelog);
});
</script>
</html>